<template>
  <div>
    <c-table-box ref="cTableBox" hide-func checkbox :other-filters="otherFilters" :table-config="tableConfig" @selection-change="selectionChange">
      <template #btn>
        <c-permission v-if="type==='all'" code="all">
          <c-button type="primary" opt-code="export" @click="exportVisible=true">导出</c-button>
          <c-button type="primary" opt-code="bcDetailedReport" @click="bcDetailedExportVisible=true">摆场施工出图明细系列面积报表</c-button>
          <c-button type="primary" opt-code="detailExport" @click="detailExportVisible=true">明细导出</c-button>
        </c-permission>
        <c-permission v-if="type==='waitMaintain'" code="maintenance">
          <c-button type="primary" opt-code="edit" @click="toDetailMaintain">编辑</c-button>
          <c-button type="primary" opt-code="submit" @click="submitHandle">提交</c-button>
        </c-permission>
        <c-permission v-else-if="type==='waitAudit'" code="audit">
          <AuditDraw :sel-data="selections" opt-code="audit" @on-success="refreshTableData" />
        </c-permission>
      </template>
    </c-table-box>
    <export-files
      v-if="exportVisible"
      title="导出"
      :config="exportConfig"
      :visible.sync="exportVisible"
    />
    <export-files
      v-if="detailExportVisible"
      title="明细导出"
      :config="detailExportConfig"
      :visible.sync="detailExportVisible"
    />
    <export-files
      v-if="bcDetailedExportVisible"
      title="摆场施工出图明细系列面积报表"
      :config="bcDetailedExportConfig"
      :visible.sync="bcDetailedExportVisible"
    />
  </div>
</template>
<script>
import { otherFiltersItem } from '@/utils'
import AuditDraw from './AuditDraw'
import { postDetailCommit, checkRepeatOutFinish } from '@/api/shopDrawing'
export default {
  name: 'List',
  components: {
    AuditDraw
  },
  props: {
    type: {
      type: String,
      default: ''
    },
    activeType: {
      type: String,
      default: ''
    },
    serachFilters: {
      type: Array,
      default: () => []
    }
  },
  data() {
    return {
      exportVisible: false,
      detailExportVisible: false,
      bcDetailedExportVisible: false,
      tableConfig: {
        interfacePath: '/slm-admin/api/v1/designOutpicDetailTask/getOutPicDetailTaskPage',
        hideFuncBar: true,
        sort: 'createTime',
        sortersRow: [
          // { 'id': 'constCode', 'property': 'constCode', 'direction': 'DESC' }
        ],
        apiHeader: {
          'Permission-App': 'slm'
        },
        setting: []
      },
      typeFilters: [],
      selections: [],
      // all
      allSetting: [
        {
          prop: 'outpicDetailTaskCode',
          label: '出图明细任务号',
          minWidth: 180,
          className: 'btn-green',
          isButton: true,
          clickFun: this.toDetail
        },
        {
          prop: 'picTaskCode',
          label: '图纸任务编码',
          minWidth: 140
        },
        {
          prop: 'picTaskName',
          label: '图纸任务名称',
          minWidth: 140
        },
        {
          prop: 'constState',
          label: '门店建设状态',
          minWidth: 100,
          propEnum: {
            domainCode: 'marketing',
            appCode: 'slm',
            dictTypeCode: 'CONST_STATE'
          }
        },
        {
          prop: 'picBatchCode',
          label: '图纸附件批次号',
          minWidth: 180
        },
        {
          prop: 'schedule',
          label: '出图明细任务进度',
          minWidth: 150,
          propEnum: {
            domainCode: 'marketing',
            appCode: 'slm',
            dictTypeCode: 'OUTPIC_DETAIL_TASK_SCHEDULE'
          }
        },
        {
          prop: 'decorationType',
          label: '装修形式',
          minWidth: 120,
          render: (h, row) => {
            return h('c-dict-range-view', {
              props: {
                dictTypeCode: 'DECORATION_FORM',
                value: row.decorationType
              }
            })
          }
        },
        {
          prop: 'picType',
          label: '图纸类型',
          minWidth: 120,
          propEnum: {
            domainCode: 'marketing',
            appCode: 'slm',
            dictTypeCode: 'PIC_TYPE'
          }
        },
        {
          prop: 'designRange',
          label: '设计范围',
          minWidth: 120,
          render: (h, row) => {
            return h('c-dict-range-view', {
              props: {
                dictTypeCode: 'DECORATION_RANGE',
                value: row.designRange
              }
            })
          }
        },
        {
          prop: 'designSpace',
          label: '设计区域',
          minWidth: 120,
          render: (h, row) => {
            return h('c-design-area', { props: { value: row.designSpace }})
          }
        },
        {
          prop: 'designBizType',
          label: '设计业务类型',
          minWidth: 120,
          render: (h, row) => {
            return h('c-dict-range-view', {
              props: {
                dictTypeCode: 'BIZ_TYPE',
                value: row.designBizType
              }
            })
          }
        },
        {
          prop: 'picTotalArea',
          label: '设计总面积',
          minWidth: 120
        },
        // {
        //   prop: 'endProArea',
        //   label: '成品面积'
        // },
        {
          prop: 'haveEAndC',
          label: '是否含成融定',
          minWidth: 120,
          propEnum: {
            domainCode: 'marketing',
            appCode: 'slm',
            dictTypeCode: 'BOOLEANS'
          }
        },
        {
          prop: 'eandCArea',
          label: '成融定面积',
          minWidth: 120
        },
        // {
        //   prop: 'allCustomizedArea',
        //   label: '定制面积'
        // },
        // {
        //   prop: 'overCupboardArea',
        //   label: '橱柜面积'
        // },
        // {
        //   prop: 'bathroomArea',
        //   label: '卫浴面积'
        // },
        // {
        //   prop: 'modelRoomArea',
        //   label: '样板间面积'
        // },
        {
          prop: 'softwareSumArea',
          label: '软体区总面积',
          minWidth: '120'
        },
        {
          prop: 'suiteSumArea',
          label: '套房区总面积',
          minWidth: '120'
        },
        {
          prop: 'newBusinessAreaSummary',
          label: '新业务总面积',
          minWidth: 120
        },
        {
          prop: 'expectEndTime',
          label: '预计设计完成时间',
          minWidth: 140,
          formatData: this.$parseTimeYMD('expectEndTime')
        },
        {
          prop: 'designUnitName',
          label: '设计单位',
          minWidth: 120
        },
        {
          prop: 'designerName',
          label: '设计师',
          minWidth: 120
        },
        {
          prop: 'constCode',
          label: '门店建设项目号',
          minWidth: 140
        },
        {
          prop: 'shopName',
          label: '所属门店',
          minWidth: 120
        },
        {
          prop: 'clientName',
          label: '所属客户',
          minWidth: 120
        },
        {
          prop: 'officeName',
          label: '所属办事处',
          minWidth: 120
        },
        {
          prop: 'enable',
          label: '启用状态',
          minWidth: 120,
          propEnum: {
            domainCode: 'marketing',
            appCode: 'slm',
            dictTypeCode: 'BOOLEANS'
          }
        },
        {
          prop: 'reviewAdvice',
          label: '审批意见',
          minWidth: 120
        }
      ],
      // waitMaintain
      waitMaintainSetting: [
        {
          prop: 'outpicDetailTaskCode',
          label: '出图明细任务号',
          minWidth: 200,
          className: 'btn-green',
          isButton: true,
          clickFun: this.toDetail
        },
        {
          prop: 'picTaskCode',
          label: '图纸任务编码',
          minWidth: 140
        },
        {
          prop: 'picTaskName',
          label: '图纸任务名称',
          minWidth: 140
        },
        {
          // prop: 'detailTaskSchedule',
          prop: 'schedule',
          label: '出图明细任务进度',
          minWidth: 120,
          propEnum: {
            domainCode: 'marketing',
            appCode: 'slm',
            dictTypeCode: 'OUTPIC_DETAIL_TASK_SCHEDULE'
          }
        },
        {
          prop: 'decorationType',
          label: '装修形式',
          minWidth: 120,
          render: (h, row) => {
            return h('c-dict-range-view', {
              props: {
                dictTypeCode: 'DECORATION_FORM',
                value: row.decorationType
              }
            })
          }
        },
        {
          prop: 'picType',
          label: '图纸类型',
          minWidth: 120,
          propEnum: {
            domainCode: 'marketing',
            appCode: 'slm',
            dictTypeCode: 'PIC_TYPE'
          }
        },
        {
          prop: 'designSpace',
          label: '设计区域',
          minWidth: 120,
          render: (h, row) => {
            return h('c-design-area', { props: { value: row.designSpace }})
          }
        },
        {
          prop: 'designBizType',
          label: '设计业务类型',
          minWidth: 120,
          render: (h, row) => {
            return h('c-dict-range-view', {
              props: {
                dictTypeCode: 'BIZ_TYPE',
                value: row.designBizType
              }
            })
          }
        },
        {
          prop: 'picTotalArea',
          label: '设计总面积',
          minWidth: 120
        },
        // {
        //   prop: 'endProArea',
        //   label: '成品面积'
        // },
        {
          prop: 'haveEAndC',
          label: '是否含成融定',
          minWidth: 120,
          propEnum: {
            domainCode: 'marketing',
            appCode: 'slm',
            dictTypeCode: 'BOOLEANS'
          }
        },
        {
          prop: 'eandCArea',
          label: '成融定面积',
          minWidth: 120
        },
        // {
        //   prop: 'allCustomizedArea',
        //   label: '定制面积'
        // },
        // {
        //   prop: 'overCupboardArea',
        //   label: '橱柜面积'
        // },
        // {
        //   prop: 'bathroomArea',
        //   label: '卫浴面积'
        // },
        // {
        //   prop: 'modelRoomArea',
        //   label: '样板间面积'
        // },
        {
          prop: 'softwareSumArea',
          label: '软体区总面积',
          minWidth: '120'
        },
        {
          prop: 'suiteSumArea',
          label: '套房区总面积',
          minWidth: '120'
        },
        {
          prop: 'newBusinessAreaSummary',
          label: '新业务总面积',
          minWidth: 120
        },
        {
          prop: 'expectEndTime',
          label: '预计设计完成时间',
          minWidth: 140,
          formatData: this.$parseTimeYMD('expectEndTime')
        },
        {
          prop: 'designUnitName',
          label: '设计单位',
          minWidth: 120
        },
        {
          prop: 'designerName',
          label: '设计师',
          minWidth: 120
        },
        {
          // prop: 'schedule',
          prop: 'detailTaskSchedule',
          label: '图纸进度',
          minWidth: 120,
          propEnum: {
            domainCode: 'marketing',
            appCode: 'slm',
            dictTypeCode: 'PIC_DESIGN_SCHEDULE'
          }
        },
        {
          prop: 'state',
          label: '图纸状态',
          minWidth: 120,
          propEnum: {
            domainCode: 'marketing',
            appCode: 'slm',
            dictTypeCode: 'PIC_DESIGN_STATE'
          }
        },
        {
          prop: 'constCode',
          label: '门店建设项目号',
          minWidth: 140
        },
        {
          prop: 'shopName',
          label: '所属门店',
          minWidth: 120
        },
        {
          prop: 'clientName',
          label: '所属客户',
          minWidth: 120
        },
        {
          prop: 'officeName',
          label: '所属办事处',
          minWidth: 120
        },
        {
          prop: 'enable',
          label: '启用状态',
          minWidth: 120,
          propEnum: {
            domainCode: 'marketing',
            appCode: 'slm',
            dictTypeCode: 'BOOLEANS'
          }
        }
      ]
    }
  },
  computed: {
    exportConfig() {
      return [{
        code: 'export',
        name: '门店出图明细管理',
        dataApi: '/slm-admin/api/v1/designOutpicDetailTask/export',
        selectedRows: this.selections,
        paramsRaw: {},
        filtersRaw: this.otherFilters,
        queryField: 'id',
        headers: {
          // 'Permission-perCode': '',
          'Permission-App': 'slm'
        }
      }]
    },
    detailExportConfig() {
      return [{
        code: 'detailExport',
        name: '出图明细',
        dataApi: '/slm-admin/api/v1/designOutpicDetailTask/exportReport',
        selectedRows: this.selections,
        paramsRaw: {},
        filtersRaw: this.otherFilters,
        queryField: 'id',
        headers: {
          'Permission-App': 'slm'
        }
      }]
    },
    bcDetailedExportConfig() {
      return [{
        code: 'bcDetailedExport',
        name: '摆场施工出图明细系列面积报表',
        dataApi: '/slm-admin/api/v1/BcConstructionOutpicDetailedReport/export',
        selectedRows: this.selections,
        paramsRaw: {},
        filtersRaw: this.otherFilters || [],
        queryField: 'id',
        headers: {
          'Permission-App': 'slm'
        }
      }]
    },
    otherFilters() {
      return [...this.serachFilters, ...this.typeFilters]
    }
  },
  watch: {
    type: {
      handler(v) {
        this.setSetting(v)
        this.setOtherFilters(v)
      },
      immediate: true
    },
    serachFilters: {
      handler(v) {
        if (this.activeType !== this.type) return
        this.$nextTick(() => {
          this.$refs.cTableBox.initTableData()
        })
      }
    }
  },
  created() {
  },
  activated() {
    if (this.ready && this.refreshTableData) {
      this.refreshTableData()
    }
  },
  deactivated() {
    this.ready = true
  },
  methods: {
    // setting
    setSetting(v) {
      switch (v) {
        case 'all':
          this.$set(this.tableConfig, 'setting', this.allSetting)
          break
        default:
          this.$set(this.tableConfig, 'setting', this.waitMaintainSetting)
          break
      }
    },
    // 设置过滤条件
    setOtherFilters(v) {
      switch (v) {
        case 'all':
          this.typeFilters = []
          break
        case 'waitMaintain':
          this.typeFilters = [
            otherFiltersItem('schedule', '[A,B]', 'in'),
            otherFiltersItem('enable', '1', '='),
            otherFiltersItem('isEnd', '0', '=')
          ]
          break
        case 'waitAudit':
          this.typeFilters = [
            otherFiltersItem('schedule', 'C', '='),
            otherFiltersItem('enable', '1', '='),
            otherFiltersItem('isEnd', '0', '=')
          ]
          break
      }
    },
    selectionChange(v) {
      this.selections = v
    },
    refreshTableData(v = 'onPage') {
      this.$nextTick(() => {
        this.$refs.cTableBox.initTableData(v)
      })
    },
    async toDetailMaintain() {
      if (!this.singleJudge(this.selections, '编辑', true)) {
        return
      }
      const r = this.selections[0]
      if (r.isRedesign === 1 || r.isRedesign === '1') {
        await checkRepeatOutFinish(r.id).catch(e => {
          return this.$msgbox({
            title: '提示',
            message: '当前为重复设计图纸，对应原图纸的出图明细尚未完成，是否继续？',
            type: 'warning',
            showCancelButton: true
          })
        })
      }
      let name = 'ShopDrawingDetailManagementBCDrawing'
      const s = this.selections[0]
      if (s.picType === 'SG' && s.designRange === 'DOOR') {
        name = 'ShopDrawingDetailManagementSGDoorDrawing'
      } else if (s.picType === 'SG' && s.designRange === 'STORES') {
        name = 'ShopDrawingDetailManagementSGStoresDrawing'
      }
      const state = s.schedule
      this.$router.push({ name, query: { id: s.id, picType: s.picType, designRange: s.designRange, outpicDetailTaskCode: s.outpicDetailTaskCode, picBatchCode: s.picBatchCode, detailTaskSchedule: s.schedule, state }})
    },
    submitHandle() {
      if (!this.singleJudge(this.selections, '提交', true)) {
        return
      }
      if (this.selections[0].schedule !== 'B') {
        this.$message.warning('请先维护数据！')
        return
      }
      return this.$msgbox({
        title: '提交',
        message: '是否确认提交已选中图纸的出图区域及面积？',
        showCancelButton: true,
        type: 'warning'
      }).then(() => {
        return postDetailCommit(this.selections[0]).then(res => {
          this.$message.success('提交成功！')
          this.refreshTableData()
        })
      })
    },
    // 详情
    toDetail(row) {
      let type = 'bc'
      if (row.picType === 'SG' && row.designRange === 'DOOR') {
        type = 'door'
      } else if (row.picType === 'SG' && row.designRange === 'STORES') {
        type = 'stores'
      }
      this.$router.push({ name: 'ShopDrawingDetailManagementDetail', query: { id: row.id, picType: row.picType, designRange: row.designRange, outpicDetailTaskCode: row.outpicDetailTaskCode, picBatchCode: row.picBatchCode, detailTaskSchedule: row.schedule, type }})
    }
  }
}
</script>
<style lang="scss" scoped>
.image{
  width: 48px;
  height: 48px;
}
</style>
